<template>
	<view class="ml-photo-frame" :style="sizeStyle">
		<image class="ml-photo" :src="src"></image>
	</view>
</template>

<script setup lang="ts">
import { computed } from 'vue';
const props = defineProps({
	src: {
		type: String,
		default: ''
	},
	width: {
		type: String,
		default: '600rpx',
	},
	height: {
		type: String,
		default: '300rpx'
	}
});

const sizeStyle = computed(() => ({
	width: props.width,
	height: props.height,
}));
</script>

<style scoped>
.ml-photo-frame {
	border: 20rpx solid rgb(174, 147, 102);
	background: rgb(174, 147, 102);
	border-bottom-width: 15rpx;
}
.ml-photo {
	width: 100%;
}
</style>
